<!doctype html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">

<head>
    <!--commonstyle-->
    <link th:include="resident/navMenu::navigation">
    <title>物流查询</title>
</head>

<body>
<!--wrapper-->
<div class="wrapper">
    <!--sidebar wrapper -->
    <div th:replace="resident/navMenu::#sideBar"></div>
    <!--end sidebar wrapper -->
    <!--start header -->
    <header th:replace="resident/navMenu::#navBar"></header>
    <!--end header -->
    <!--start page wrapper -->
    <div class="page-wrapper">
        <div class="page-content">
            <!--breadcrumb-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3">物流查询</div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <a th:href="@{/scan}" style="text-decoration: none">
                            <button class="layui-btn layui-btn-primary layui-border-blue">确认收货</button>
                        </a>
                    </nav>
                </div>
            </div>
            <!--end breadcrumb-->
            <div class="">
                <div class="">
                    <div class="container py-2">
                        <h2 class="font-weight-light text-center text-muted py-3">订单物流信息</h2>
                        <br/>
                        <br/>
                        <div th:each="form,status:${formList}">
                            <h3 class="font-weight-light text-center text-muted py-3">订单:<i th:text="${form.getId()}"></i></h3>
                            <h4 class="font-weight-light text-center text-muted py-3">下单时间:<i th:text="${form.getTimeString()}"></i></h4>
                            <!-- timeline item 1 -->
                            <div class="row g-0" th:if="${form.getPastdue()==1}">
                                <div class="col-sm">
                                    <!--spacer-->
                                </div>
                                <!-- timeline item 1 center dot -->
                                <div class="col-sm-1 text-center flex-column d-none d-sm-flex">
                                    <div class="row h-50">
                                        <div class="col">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                    <h5 class="m-2">
                                        <span class="badge rounded-pill bg-light border">&nbsp;</span>
                                    </h5>
                                    <div class="row h-50">
                                        <div class="col border-end">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                </div>
                                <!-- timeline item 1 event content -->
                                <div class="col-sm py-2">
                                    <div class="card radius-15">
                                        <div class="card-body">
                                            <div class="float-end text-muted small" th:text="${form.getTimeString()}"></div>
                                            <h4 class="card-title text-muted"><i class="bx bx-happy-beaming"></i>订单已签收</h4>
                                            <p class="card-text">您的该订单已经确认签收了，亲</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--/row-->
                            <!-- timeline item 2 -->
                            <div class="row g-0" th:if="${(form.getPastdue()==2)||(form.getPastdue()==1)}">
                                <div class="col-sm py-2">
                                    <div class="card border-primary shadow radius-15">
                                        <div class="card-body">
                                            <div class="float-end text-primary small" th:text="${form.getTimeString()}"></div>
                                            <h4 class="card-title text-primary"><i class="bx bx-happy-heart-eyes"></i>订单已送达，亲，请尽快到指定地点拿哦</h4>
                                            <p class="card-text">派送员小哥已经用最快的速度把你的订购的物品送到了，亲，为了防止发生意外，请尽快去取哦</p>
                                            <button class="btn btn-sm btn-outline-secondary" type="button" data-bs-target="#t22_details" data-bs-toggle="collapse">订单信息▼</button>
                                            <div class="collapse border" id="t22_details">
                                                <div class="p-2 text-monospace">
                                                    <div>派送员:<i th:text="${form.getUsername()}"></i></div>
                                                    <div>到达时间:<i th:text="${form.getTimeString()}"></i></div>
                                                    <div>到达地点:<i th:text="${form.getAddress()}"></i></div>
                                                    <div>物品已消毒</div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-1 text-center flex-column d-none d-sm-flex">
                                    <div class="row h-50">
                                        <div class="col border-end">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                    <h5 class="m-2">
                                        <span class="badge rounded-pill bg-primary">&nbsp;</span>
                                    </h5>
                                    <div class="row h-50">
                                        <div class="col border-end">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                </div>
                                <div class="col-sm">
                                    <!--spacer-->
                                </div>
                            </div>
                            <!--/row-->
                            <!-- timeline item 3 -->
                            <div class="row g-0" th:if="${(form.getPastdue()==0&&form.getGetherId()!='0')||(form.getPastdue()==2)||(form.getPastdue()==1)}">
                                <div class="col-sm">
                                    <!--spacer-->
                                </div>
                                <div class="col-sm-1 text-center flex-column d-none d-sm-flex">
                                    <div class="row h-50">
                                        <div class="col border-end">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                    <h5 class="m-2">
                                        <span class="badge rounded-pill bg-light border">&nbsp;</span>
                                    </h5>
                                    <div class="row h-50">
                                        <div class="col border-end">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                </div>
                                <div class="col-sm py-2">
                                    <div class="card radius-15">
                                        <div class="card-body">
                                            <div class="float-end text-muted small" th:text="${form.getTimeString()}"></div>
                                            <h4 class="card-title"><i class="bx bx-run"></i>派送员已接单，派送员正在加急配送中</h4>
                                            <p>快递小哥正在快马加鞭的往配送地点赶哦</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!--/row-->
                            <!-- timeline item 4 -->
                            <div class="row g-0"  th:if="${(form.getPastdue()==0&&form.getGetherId()!='0')||(form.getPastdue()==2)||(form.getPastdue()==0&&form.getGetherId()=='0')||(form.getPastdue()==1)}">
                                <div class="col-sm py-2">
                                    <div class="card radius-15">
                                        <div class="card-body">
                                            <div class="float-end text-muted small">订单创建时间:<i th:text="${form.getTimeString()}"></i></div>
                                            <h4 class="card-title"><i class="lni lni-mailchimp"></i>物品以从<i th:text="${form.getDefaultaddress()}" style="color: blue"></i>发货,亲，就快要到了哦</h4>
                                            <p>物品已发货，正在等待派送员接单哦，亲</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-sm-1 text-center flex-column d-none d-sm-flex">
                                    <div class="row h-50">
                                        <div class="col border-end">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                    <h5 class="m-2">
                                        <span class="badge rounded-pill bg-light border">&nbsp;</span>
                                    </h5>
                                    <div class="row h-50">
                                        <div class="col">&nbsp;</div>
                                        <div class="col">&nbsp;</div>
                                    </div>
                                </div>
                                <div class="col-sm">
                                    <!--spacer-->
                                </div>
                            </div>
                        </div>
                        <!--/row-->
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--end page wrapper -->
</div>
<!--end wrapper-->
<div th:include="resident/navMenu::#footerBar"></div>
</body>

</html>